<%@ page language="java" import="java.util.*"  contentType="text/html; charset=utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
  <head>
    <title>图书销售主页</title>
   <script type="text/javascript">
  </script>
  <style type="text/css">
  *{
  	font-family: "微软雅黑";
  }
  body{
  	background-image: url("images/bgcolor.png");
  }
  #top{
  		position:relative;
  		top:20px;
  		font:80px '华文行楷';
  		color:#5B5B5B;
  }
  #select{
  		position:relative;
  		top:50px;
  }
   #cusreg{
 	border:0px;
 	background-color:transparent;
 	width:300px;
 	height:100px;
 	font-size:30px;
 	color:#5B5B5B;
 	font-family: '幼圆';
    font-weight:bold;
 }
 #cuslog{
 	border:0px;
 	background-color:transparent;
 	width:300px;
 	height:100px;
 	font-size:30px;
 	color:#5B5B5B;
 	font-family: '幼圆';
    font-weight:bold;
 }
 #adlog{
 	border:0px;
 	background-color:transparent;
 	width:300px;
 	height:100px;
 	font-size:30px;
 	color:#5B5B5B;
 	font-family: '幼圆';
    font-weight:bold;
 }
 #deer{
  		position:absolute;
  		top:45%;
  		left:5%;
  	}
  	a{
  		text-decoration:none;
  		color:white;
  	}
  	.penal{
  		width:410px;
  		height:420px;
  		background: white;
  		margin:140px auto;
  		padding:53px;
  		border-radius:20px;
  		box-sizing: border-box;
  		box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.4); 
  	}
  	.left{
  			clear:both;
		  border-bottom: 1px solid #2D456B;
		  height: 41px;
		  line-height: 41px;
		  float:left;
		  color: #666;
  	}
  	input[type=text]{
  		border:0;
  		color: #666;
		  height: 2.5625rem;
		  width: 16.8125rem;
		  text-indent: 3.125rem;
		  outline: none;
  	}
  	input[type=password]{
  		border:0;
  		color: #666;
		  height: 2.5625rem;
		  width: 16.8125rem;
		  text-indent: 3.125rem;
		  outline: none;
		  background: none;
  	}
   .b{
   		border-bottom: none;
  		outline: none;
  		height: 2.5625rem;
		  border: none;
		  color: #fff;
		  width: 18.825rem;
		  text-align: center;
		  background-color: #2D456B;
		  text-indent: 0rem;
		  cursor:pointer;
		  font-family: 20px;
  	}
  	.input{
  			float:left;
  		  color: #666;
  		  border-bottom: 0.0625rem solid #2D456B;
		  height: 2.5625rem;
		  width: 16.8125rem;
  	}
  	h2{
  		font-family: "微软雅黑";
  		margin-left:75px;
  		  width: 200px;
		  height: 35px;
		  color: #2d456b;
		  font-size: 1.5rem;
		  text-align: left;
  	}
  </style>
  </head>
  
  <body>
  <%
  	request.setCharacterEncoding("utf-8");
  	String info = request.getParameter("info");
  	String id = request.getParameter("id");
  %>
  	<div align="center" id="top">欢迎进入图书销售系统<hr size="5px" width="70%" color="#5B5B5B"/></div>
	<div id="deer">
		<img src="images/img_deer.png" style="height: 300px; width: 300px; ">
	</div>
	<div class="penal">
		<h2>图书销售系统</h2>
		<span id="info"></span>
  		<form action="loginServlet" method="post" onsubmit="return check()">
  				<div class="left">账号</div><div class="input"><input type="text" placeholder="请输入账号" name="id" id="id"/></div>
  				<div class="left">密码</div><div class="input"><input type="password" placeholder="请输入密码" name="password" id="password"/></div>
  				<div class="left" style="border:none">类型</div><div class="input" style="padding-top:10px;border:0"><input type="radio" name="type" value="customer" checked/>用户   <input type="radio" name="type" value="seller"/>销售商  <input type="radio" name="type" value="manager"/>管理员</div>
  				<div class="left" style="float:none;cursor:pointer;border:none"><input type="submit" value="登录" class="b"/></div>
  				<div style="clear:both;background:#F45353;margin-top:10px;padding-top:10px;box-sizing: border-box;" class="b"><a href="javascript:void(0)" onclick="register()">注册</a></div>
  		</form>
	</div>
  </body>
  <script>
  	window.onload = function(){
  		var info = "<%=info%>";
  		var id = "<%=id%>";
  		if(info!="null"){
  			document.getElementById("info").innerHTML=info;
  		}
  		if(id!="null"){
  			alert("请记住，你的账号是:"+id);
  		}
  	}
  	function register(){
  		window.location.href="register.jsp";
  	}
  	function check(){
  		var id = document.getElementById("id").value;
  		var password = document.getElementById("password").value;
  		if(id == null || id == ""){
  			alert("请输入用户名！");
  			return false;
  		}
  		if(password == null || password == ""){
  			alert("请输入密码！");
  			return false;
  		}
  		return true;
  	}
  </script>
</html>
